﻿<template>
    <div class="busFileList-container">
        <el-dialog v-model="isShowDialog" :title="props.title" :width="700" draggable="">
            <el-form :model="ruleForm" ref="ruleFormRef" size="default" label-width="100px" :rules="rules">
                <el-row :gutter="35">
                    <el-form-item v-show="false">
                        <el-input v-model="ruleForm.id" />
                    </el-form-item>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="业务类型" prop="businessType">
                            <el-select clearable filterable v-model="ruleForm.businessType" placeholder="请选择业务类型" @change="changeSCDL">
                                <el-option v-for="(item,index) in sysClassDropdownList" :key="index" :value="item.value" :label="item.label" />

                            </el-select>

                        </el-form-item>

                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="业务外键" prop="dataPK">
                            <el-select clearable v-model="ruleForm.dataPK" placeholder="请选择业务外键">
                                <el-option v-for="(item,index) in  getEditdataPKData" :key="index" :value="item.value" :label="item.label"></el-option>

                            </el-select>

                        </el-form-item>

                    </el-col>
                    <el-col>
                        <el-form-item label="操作文件" prop="dataPK">
                            <el-upload ref="uploadRef" class="upload-demo" action="#" :http-request="uploadFile"
                                       :before-upload="beforeUpload">
                                <el-button size="small" type="primary">点击上传</el-button>
                            </el-upload>
                        </el-form-item>
                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="文件名称" prop="fileName">
                            <el-input v-model="ruleForm.fileName" placeholder="上传文件后自动赋值" clearable readonly />

                        </el-form-item>

                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="文件类型" prop="fileFlag">
                            <el-input v-model="ruleForm.fileFlag" placeholder="上传文件后自动赋值" clearable readonly />

                        </el-form-item>

                    </el-col>
                    <el-col :xs="24" :sm="12" :md="12" :lg="12" :xl="12" class="mb20">
                        <el-form-item label="文件地址" prop="filePath">
                            <el-input v-model="ruleForm.filePath" placeholder="上传文件后自动赋值" clearable readonly />

                        </el-form-item>

                    </el-col>

                </el-row>
            </el-form>
            <template #footer>
                <span class="dialog-footer">
                    <el-button @click="cancel" size="default">取 消</el-button>
                    <el-button type="primary" @click="submit" size="default">确 定</el-button>
                </span>
            </template>
        </el-dialog>
    </div>
</template>

<script lang="ts" setup>
    import { ref, onMounted } from "vue";
    import { ElMessage } from "element-plus";
    import type { FormRules } from "element-plus";
    import { addBusFileList, updateBusFileList, getSysClassDropdown, GetPKDataListDropdown, UpLoadFileMethod } from "/@/api/main/busFileList";
    import { getDictDataList } from '/@/api/system/admin';
    import { SysFileApi, SysUserApi } from '/@/api-services/api';
    import { clearAccessTokens, getAPI } from '/@/utils/axios-utils';
    const getEditdataPKData = ref<any>([]);
    const getEditisDeleteData = ref<any>([]);
    //父级传递来的参数
    var props = defineProps({
        title: {
            type: String,
            default: "",
        },
    });
    //父级传递来的函数，用于回调
    const emit = defineEmits(["reloadTable"]);
    const ruleFormRef = ref();
    const isShowDialog = ref(false);
    let businessTypeValue = "";
    const ruleForm = ref<any>({});
    //自行添加其他规则
    const rules = ref<FormRules>({
    });

    // 打开弹窗
    const openDialog = (row: any) => {
        ruleForm.value = JSON.parse(JSON.stringify(row));
        isShowDialog.value = true;
    };

    // 关闭弹窗
    const closeDialog = () => {
        emit("reloadTable");
        isShowDialog.value = false;
    };

    // 取消
    const cancel = () => {
        isShowDialog.value = false;
    };

    // 提交
    const submit = async () => {
        ruleFormRef.value.validate(async (isValid: boolean, fields?: any) => {
            if (isValid) {
                let values = ruleForm.value;
                if (ruleForm.value.id != undefined && ruleForm.value.id > 0) {
                    await updateBusFileList(values);
                } else {
                    await addBusFileList(values);
                }
                closeDialog();
            } else {
                ElMessage({
                    message: `表单有${Object.keys(fields).length}处验证失败，请修改后再提交`,
                    type: "error",
                });
            }
        });
    };

    const dictTypeDataList = async (val: any) => {
        let list = await getDictDataList(val);
        return list.data.result ?? [];
    };

    const sysClassDropdownList = ref<any>([]);
    const getSysClassDropdownList = async () => {
        let list = await getSysClassDropdown();
        sysClassDropdownList.value = list.data.result ?? [];
    };
    getSysClassDropdownList();

    const GetPKDataListDropdownList = async (value: any) => {
        let list = await GetPKDataListDropdown({ 'fkstr': value });
        getEditdataPKData.value = list.data.result ?? [];
    };

    const changeSCDL = async (value: any) => {
        GetPKDataListDropdownList(value);
        businessTypeValue = value;
    }

    const uploadFile = async (value: any, valuetype: any) => {
        //const { file } = value
        //console.log(file);
        //const fd = new FormData()
        //fd.append('files', file)
        //fd.append('files', file)
        //let ress = await UpLoadFileMethod(fd);
        //ruleForm.fileName = ress.FileName;
        //ruleForm.filePath = ress.FilePath;
        //ruleForm.fileFlag = ress.Suffix;
        var ress = await getAPI(SysFileApi).apiSysFileUploadFileForFlagPostForm(value.file, businessTypeValue);
        ruleForm.value.fileName = ress.data.result.fileName;
        ruleForm.value.filePath = ress.data.result.filePath;
        ruleForm.value.fileFlag = ress.data.result.suffix;
    }

    // 页面加载时
    onMounted(async () => {
        //getEditdataPKData.value= await dictTypeDataList('');
        getEditisDeleteData.value = await dictTypeDataList('data_yes_no');
    });

    //将属性或者函数暴露给父组件
    defineExpose({ openDialog });

</script>




